import Phaser from "phaser";

import DustPhaserPlugin from './modules/dust-phaser-plugin'
import PhaserFollowPlugin from './modules/phaser-plugin-follow'
import EasyProgressbarPlugin from './modules/phaser3-plugin-easyprogressbar'

/**
 * @class PhaserGameConfig
 * @module PhaserGameConfig -phaser3启动配置类
 * @link https://www.npmjs.com/package/dust-phaser-plugin -场景漂浮物体插件
 * @link https://www.npmjs.com/package/phaser-plugin-follow -固定跟随目标物体插件
 * @link https://www.npmjs.com/package/phaser3-plugin-easyprogressbar -进度条插件
 * @link https://www.npmjs.com/package/phaser3-vjoy-plugin -虚拟摇杆插件(请使用v1.0.1)
 */
export default class PhaserGameConfig extends Phaser.Game {
    /**
     * @param {object} _obj -width:default(1000) -height:default(1000) -parent:default('#games-root')
     * -backgroundColor:default('#000') -dom(true) -version:default(1.0.0) -title:default('phaser3-rpg')
     * @param {Array} _arrScene -[]:default[]
     * 
     * @summary width: 游戏世界宽度
     * @summary height: 游戏世界高度
     * @summary parent: Canvas 挂载 DOM
     * @summary backgroundColor: 游戏背景颜色
     * @summary dom: 游戏是否启用与 HTML DOM 元素交互
     * @summary version: 游戏版本
     * @summary title: 游戏名称
     * @summary _arrScene: 游戏场景数组
     * @summary _obj: 游戏配置对象
     */
    constructor(_obj = {
        width: 1000,
        height: 1000,
        parent: '#games-root',
        backgroundColor: '#000',
        dom: true,
        version: '1.0.0',
        title: 'phaser3-rpg',
        buger: true
    }, _arrScene = [], callback) {
        super({
            type: Phaser.AUTO,
            width: _obj.width,
            height: _obj.height,
            backgroundColor: _obj.backgroundColor,
            parent: document.querySelector(`${_obj.parent}`),
            dom: {
                createContainer: _obj.dom
            },
            fps: 60,
            physics: {
                default: 'arcade',
                arcade: {
                    gravity: {
                        y: 300
                    },
                    debug: _obj.buger
                }
            },
            input: {
                activePointers: 4
            },
            version: _obj.version,
            title: _obj.title,
            plugins: {
                global: [{
                    key: 'EasyProgressbarPlugin',
                    plugin: EasyProgressbarPlugin,
                    start: true
                }],
                scene: [
                    {
                        key: 'SpinePlugin',
                        plugin: window.SpinePlugin,
                        mapping: 'spine'
                    },
                    {
                        key: "DustPlugin",
                        plugin: DustPhaserPlugin,
                        mapping: "dust"
                    },
                    {
                        key: 'FollowPlugin',
                        plugin: PhaserFollowPlugin,
                        mapping: 'follow'
                    }
                ]
            },
            scene: _arrScene
        })
        window.localStorage.setItem('world-width', _obj.width);
        window.localStorage.setItem('world-height', _obj.height);
        window.localStorage.setItem('view-width', window.screen.width);
        window.localStorage.setItem('view-height', window.screen.height);
        callback({
            'world-width': window.localStorage.getItem('world-width'),
            'world-height': window.localStorage.getItem('world-height'),
            'view-width': window.localStorage.getItem('view-width'),
            'view-height': window.localStorage.getItem('view-height'),
            'show': 'world-width:世界宽度,world-height:世界高度,view-width:摄像机宽度,view-height:摄像机高度'
        });
    }
}